<template>
  <div class="home">
    <div>
      websocket实例 ： {{ getWebsocketInstance }}
    </div>
    <div>
      msg : {{msg}}
    </div>
    <div>
      <router-link to="/about">go about</router-link>
    </div>
  </div>
</template>

<script>


export default {
  name: 'Home',
  components: {
  },
  created() {
    this.connectWebsocket();
  },
  data() {
    return {
      websocketInstance: {},
      msg: ""
    }
  },
  computed: {
    getWebsocketInstance(){
      // console.log(this.$store.state.websocketInstance)
      return this.$store.state.websocketInstance;
    }
  },
  methods:{
    connectWebsocket(){
      let url  = "ws://localhost:3000/socketTest";
      this.webSocketInstance = new WebSocket(url);
      this.$store.commit("setWebSocket", this.webSocketInstance)
      this.webSocketInstance.onmessage = (evt => {
        console.log(evt.data)
        this.msg = evt.data
      })
    }
  }
}
</script>
